import React, { ReactNode } from 'react';
import { Box, Typography } from '@mui/material';

interface InfoItemProps {
    label: string;
    value: string | ReactNode;
    customContent?: boolean;
    isUpLoad?: boolean;
}

const InfoItem: React.FC<InfoItemProps> = ({ label, value, customContent = false, isUpLoad }) => (
    <Box className="form-grid-item">
        <Typography className="form-item-label">{label}</Typography>
        {isUpLoad ? (
            value
        ) : customContent ? (
            <Box className="form-item-value">{value}</Box>
        ) : (
            <Typography className="form-item-value">{value}</Typography>
        )}
    </Box>
);

export default InfoItem;
